<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>添加新闻</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
        }
        body {
            background-color: #f5f5f5;
            color: #333;
            font-size: 14px;
        }
         .header {
            display: flex;
            align-items: center;
            padding: 10px 15px;
            background-color: white;
            border-bottom: 1px solid #eee;
        }
        .header-back {
            margin-right: 10px;
            font-size: 12px;
            color: #666;
        }
        .header-title {
            flex: 1;
            font-size: 16px;
            font-weight: bold;
        }
        .header-more {
            font-size: 12px;
            color: #666;
        }
        .container {
            padding: 15px;
        }
        .form-group {
            margin-bottom: 15px;
        }
        .form-label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
        }
        .form-input {
            width: 100%;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 14px;
        }
        .form-textarea {
            width: 100%;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 14px;
            min-height: 100px;
            resize: vertical;
        }
        .form-select {
            width: 100%;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 14px;
            background-color: white;
        }
        .submit-btn {
            width: 100%;
            padding: 12px;
            background-color: #00cc00;
            color: white;
            border: none;
            border-radius: 4px;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            margin-top: 20px;
        }
        .submit-btn:active {
            background-color: #00aa00;
        }
        .image-preview {
            width: 100%;
            height: 150px;
            background-color: #eee;
            border-radius: 4px;
            margin-top: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }
        .image-preview img {
            max-width: 100%;
        }
        .image-placeholder {
            color: #999;
            font-size: 12px;
        }
        .image-select-btn {
            width: 100%;
            padding: 10px;
            background-color: #f0f0f0;
            border: 1px solid #ddd;
            border-radius: 4px;
            text-align: center;
            cursor: pointer;
            margin-top: 10px;
        }
    </style>
</head>
<body>
<div class="header">
    <div class="header-back" onclick="goBack()">←</div>
    <div class="header-title"></div>
    <div class="header-more"></div>
</div>
<div class="container">
    <form id="newsForm">
        <div class="form-group">
            <label for="title" class="form-label">新闻标题</label>
            <input type="text" id="title" class="form-input" placeholder="请输入新闻标题">
        </div>
        <div class="form-group">
            <label for="content" class="form-label">新闻内容</label>
            <textarea id="content" class="form-textarea" placeholder="请输入新闻内容"></textarea>
        </div>
        <div class="form-group">
            <label for="time" class="form-label">发布时间</label>
            <input type="date" id="time" class="form-input">
        </div>
        <div class="form-group">
            <label class="form-label">新闻图片</label>
            <div class="image-preview" id="imagePreview">
                <span class="image-placeholder">点击下方按钮选择图片</span>
            </div>
            <div class="image-select-btn" onclick="openGallery()">选择图片</div>
            <input type="hidden" id="imagePath" name="imagePath">
        </div>
        <button type="submit" class="submit-btn">发布新闻</button>
    </form>
</div>
<script>
    // 返回上一页
    function goBack() {
        window.history.back();
    }
    // 显示提示信息
    function showToast(message) {
        alert(message);
    }

    // 检查localStorage是否可用
    function isLocalStorageAvailable() {
        try {
            const testKey = '__storage_test__';
            localStorage.setItem(testKey, testKey);
            localStorage.removeItem(testKey);
            return true;
        } catch (e) {
            return false;
        }
    }

    // 打开图库
    function openGallery() {
        if (window.myInterface && window.myInterface.openGallery) {
            window.myInterface.openGallery();
        } else {
            showToast('无法打开图库');
        }
    }

    // 设置图片路径（修改为支持Base64和file://路径）
    function setImagePath(imagePath) {
        const imagePreview = document.getElementById('imagePreview');
        // 检查是否为Base64格式（包含data:image前缀）
        if (imagePath.startsWith('data:image')) {
            imagePreview.innerHTML = `<img src="${imagePath}" alt="预览图片">`;
        } else {
            // 尝试作为file://路径加载
            imagePreview.innerHTML = `<img src="${imagePath}" alt="预览图片">`;
        }
        document.getElementById('imagePath').value = imagePath;
    }

    // 表单提交处理
    document.getElementById('newsForm').addEventListener('submit', function(e) {
        e.preventDefault();
        const title = document.getElementById('title').value.trim();
        const content = document.getElementById('content').value.trim();
        const time = document.getElementById('time').value;
        const imagePath = document.getElementById('imagePath').value;

        // 表单验证
        if (!title) {
            showToast('请输入新闻标题');
            return;
        }
        if (!time) {
            showToast('请选择发布时间');
            return;
        }
        if (!imagePath) {
            showToast('请选择新闻图片');
            return;
        }

        // 准备新闻数据
        const newsData = {
            title,
            content,
            time,
            views: 0, // 默认为0
            image: imagePath
        };

        try {
            if (window.myInterface && window.myInterface.saveNewsToDatabase) {
                const success = window.myInterface.saveNewsToDatabase(JSON.stringify(newsData));
                if (success) {
                    showToast('新闻发布成功，正在返回...');
                    setTimeout(() => {
                        location.href = 'xinwen.html';
                    }, 1500);
                } else {
                    showToast('新闻发布失败，请重试');
                }
            } else {
                showToast('无法连接到原生接口，请重试');
            }
        } catch (error) {
            console.error('Failed to save news data:', error);
            showToast('发布失败，请重试');
        }
    });
</script>
</body>
</html>